<template>
  <div>
    <div id="main" style="width: 600px;height:500px;">

    </div>
  </div>
</template>

<script>
import * as echarts from 'echarts'
import {getSalesChart} from "@/api/sales/sales_echarts";

export default {
  name: "",
  data() {
    return {}
  },

  methods: {
    /** 初始化echarts图表 */
    initChart() {
      console.log(3333)
      // 4基于准备好的dom，初始化echarts实例
      let chart = echarts.init(document.getElementById('main'))
      // 5 配置图表
      let option = {
        title: {
          text: '出库单号及金额'
        },
        tooltip: {},
        legend: {},
        xAxis: {
          data: []
        },
        yAxis: {},
        series: [{
          name: '出库单号及金额',
          type: 'bar',
          data: []
        }]
      }
      // 6 使用配置项和数据显示图表
      chart.setOption(option)
      // 7 发送请求获取数据
      getSalesChart().then(res => {
        console.log("出库单号及金额", res.data)

        // x轴数据
        option.xAxis.data = res.data.AllAmountList[0]
        // y轴数据
        option.series[0].data = res.data.AllAmountList[1
          ]
        chart.setOption(option)
      })
    },


  },
  mounted() {
    console.log(123456)
    this.initChart()
  }

}
</script>

<style scoped lang="scss">

</style>
